<script lang="ts" setup>
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { ProductStateModel } from '#/api/production/models';

import { Page, useVbenModal } from '@vben/common-ui';

import { Button, Dropdown, Menu, MenuItem, Modal } from 'ant-design-vue';

import { useVbenVxeGrid } from '#/adapter/vxe-table';
import {
  getProductPagedListApi,
  unfitProductApi,
} from '#/api/production/productState';

import { useColumns, useSearchSchema } from './data';
import ConcedeForm from './modules/concede-form.vue';
import ScrapForm from './modules/scrap-form.vue';

const [ConcedeFormModal, concedeFormModalApi] = useVbenModal({
  connectedComponent: ConcedeForm,
  destroyOnClose: true,
});

const [ScrapFormModal, scrapFormModalApi] = useVbenModal({
  connectedComponent: ScrapForm,
  destroyOnClose: true,
});

const [Grid, gridApi] = useVbenVxeGrid({
  formOptions: {
    collapsed: true,
    schema: useSearchSchema(),
    // 控制表单是否显示折叠按钮
    showCollapseButton: true,
    submitOnEnter: true,
  },
  gridOptions: {
    columns: useColumns(),
    border: true,
    stripe: true,
    pagerConfig: {},
    proxyConfig: {
      ajax: {
        query: async ({ page }, formValues) => {
          return await getProductPagedListApi({
            pageNumber: page.currentPage,
            pageSize: page.pageSize,
            ...formValues,
          });
        },
      },
    },
  } as VxeTableGridOptions,
});

/**
 * 让步接收
 * @param row
 */
function onConcede(row: ProductStateModel) {
  concedeFormModalApi.setData(row).open();
}

/**
 * 报废
 * @param row
 */
function onScrap(row: ProductStateModel) {
  scrapFormModalApi.setData(row).open();
}

const unfitConfirm = (row: ProductStateModel) => {
  Modal.confirm({
    title: '确定要强制不合格吗?',
    content: `零件码：${row.sn}`,
    onOk: async () => {
      gridApi.setLoading(true);
      await unfitProductApi(row.id);
      await gridApi.query();
      gridApi.setLoading(false);
    },
    onCancel() {},
  });
};

/**
 * 刷新表格
 */
function refreshGrid() {
  gridApi.query();
}
</script>

<template>
  <Page auto-content-height>
    <ConcedeFormModal @success="refreshGrid()" />
    <ScrapFormModal @success="refreshGrid()" />
    <Grid>
      <template #action="{ row }">
        <Dropdown>
          <template #overlay>
            <Menu>
              <MenuItem
                :disabled="row.isCompelted || ![2, 4].includes(row.status)"
                @click="onConcede(row)"
              >
                让步接收
              </MenuItem>
              <MenuItem
                :disabled="row.isCompelted || ![1, 3].includes(row.status)"
                danger
                @click="unfitConfirm(row)"
              >
                强制 NG
              </MenuItem>
              <MenuItem
                :disabled="row.isCompelted || ![2, 4].includes(row.status)"
                danger
                @click="onScrap(row)"
              >
                强制报废
              </MenuItem>
            </Menu>
          </template>
          <Button size="small" type="link"> 更多操作 </Button>
        </Dropdown>
      </template>
    </Grid>
  </Page>
</template>
